<template>
  <el-drawer :title="title" :visible.sync="visible" append-to-body class="drawer-container" size="800px">
    <el-form ref="form" :model="formdata" :rules="formrule" label-position="right" label-suffix=":" label-width="100px">
      <el-row>
        <el-col :span="12">
          <el-form-item label="租户名称" prop="name">
            <el-input v-model="formdata.name" placeholder="请输入租户名称"/>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="租户编码" prop="code">
            <el-input v-model="formdata.code" placeholder="请输入租户名称"/>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="租户套餐" prop="type">
            <el-select v-model="formdata.type" clearable placeholder="请选择租户类型" style="width: 100%">
              <el-option v-for="item in localDict.role_type" :label="item.label" :value="item.value"/>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="租户状态" prop="status">
            <el-select v-model="formdata.status" clearable placeholder="请选择租户状态" style="width: 100%">
              <el-option v-for="item in localDict.tenant_status" :label="item.label" :value="item.value"/>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="显示排序" prop="sort">
            <el-input-number v-model="formdata.sort" :min="0" controls-position="right"/>
          </el-form-item>
        </el-col>
      </el-row>
      <el-form-item label="租户描述">
        <el-input v-model="formdata.remark" :rows="3" placeholder="请输入租户描述" type="textarea"/>
      </el-form-item>
    </el-form>
    <div class="drawer-footer">
      <el-button type="primary" @click="handleSubmit">确 定</el-button>
      <el-button @click="handleCancel">取 消</el-button>
    </div>
  </el-drawer>
</template>

<script>

import {getInfo, save} from "@/api/base";
import {getStaticData} from "@/api/common";

export default {
  name: "TenantGroupModel",
  components: {},
  data() {
    return {
      title: '',
      visible: false,
      baseUrl: '/system/tenant/group/',
      formdata: {},
      formrule: {
        // 表单校验
        name: [
          {required: true, message: "角色名称不能为空", trigger: "blur"}
        ],
        code: [
          {required: true, message: "权限字符不能为空", trigger: "blur"}
        ],
        type: [
          {required: true, message: "权限字符不能为空", trigger: "blur"}
        ],
        scope: [
          {required: true, message: "权限字符不能为空", trigger: "blur"}
        ],
        sort: [
          {required: true, message: "角色顺序不能为空", trigger: "blur"}
        ]
      },
      localDict: {
        tenant_type: [],
        tenant_status: [],
      },
    }
  },
  created() {
    this.getLocalDict();
  },
  methods: {
    add() {
      this.resetForm('form')
      this.formdata = {
        status: '00'
      }
      this.visible = true
      this.title = '新增租户'
    },
    edit(id) {
      this.resetForm('form')
      getInfo(this.baseUrl, id).then(res => {
        this.formdata = res.data
        this.visible = true
        this.title = '修改租户'
      })
    },
    async getLocalDict() {
      await getStaticData('system-tenant-type').then(res => {
        this.localDict.tenant_type = res.data
      })
      await getStaticData('system-status').then(res => {
        this.localDict.tenant_status = res.data
      })
    },
    handleSubmit() {
      this.$refs["form"].validate(valid => {
        if (valid) {
          save(this.baseUrl, this.formdata).then(() => {
            this.$modal.msgSuccess("保存成功");
            this.visible = false;
            this.resetForm('form')
            this.$emit('ok')
          });

        }
      });
    },
    handleCancel() {
      this.visible = false
      this.resetForm('form')
      this.$emit('close')
    }
  }
}
</script>
<style lang="scss" scoped>

</style>
